﻿<!DOCTYPE >
<html>
<head>
    <title>樂點公車即時資訊服務</title>
    <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0" />
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <style type="text/css">
        html
        {
            height: 100%;
            width: 100%;
            max-width: 320px;
            min-width: 320px;
        }
        body
        {
            height: 100%;
            width: 100%;
            margin: 0px;
            padding: 0px;
            max-width: 320px;
            min-width: 320px;
        }
        #list_canvas
        {
            height: 100%;
            max-width: 320px;
            min-width: 320px;
        }
    </style>
    <script type="text/ecmascript" src="js/jquery-1.7.1.min.js"></script>
    <script type="text/ecmascript" src="js/jquery.mobile-1.1.0.min.js"></script>
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
    <link rel="stylesheet" href="css/jquery.mobile-1.1.0.min.css" />
    <link type="text/css" rel="stylesheet" href="css/style.css" />
    <link type="text/css" rel="stylesheet" href="css/bus.css" />
</head>
<body>
    <div data-role="page" id="infopage">
        <div id="fb-root">
        </div>
        <script>
            (function (d, s, id) {
                var js, fjs = d.getElementsByTagName(s)[0];
                if (d.getElementById(id)) return;
                js = d.createElement(s); js.id = id;
                js.src = "//connect.facebook.net/zh_TW/all.js#xfbml=1&appId=250387874972752";
                fjs.parentNode.insertBefore(js, fjs);
            } (document, 'script', 'facebook-jssdk'));

            $(document).ready(function () {
                //var queryString = window.location.search.substring(1);
                // $("#toQuestionnaire").attr("href", "questionnaire.aspx?" + queryString);

                var width = $(window).width();
                setTimeout(function () {
                    $("#header, #content, #footer").width(width);
                }, 3000);
            }); 
        </script>
        <div data-id="header" id="heaer" data-role="header" data-position="fixed">
            <div class="bg">
                <div class="head_bar" id="infopage_head_bar">
                    <ul>
                    </ul>
                </div>
            </div>
        </div>
        <div id="stop_alert_list">
        </div>
        <div id="content" data-role="content">
            <div style="margin: 10px;">
                <div>
                    <br />
                    <br />
                    <a id="toQuestionnaire" href="questionnaire.aspx" target="_self" data-role="button"
                        style="font-size: 13px; height: 32px; color: red;">親愛的乘客!歡迎您點此反映您的乘車意見,讓我們服務更加完善。
                    </a>
                </div>
                <div class="fb-comments" data-href='<%=Request.Url.AbsoluteUri %>' data-num-posts="3" data-width="">
                </div>
                <script>
                    $('.fb-comments').attr('data-width', window.screen.width - 20);
                </script>
            </div>
        </div>
        <div data-id="footer" data-role="footer" data-position="fixed" style="position: fixed;">
            <div id="dock-bottom" class="dock">
            </div>
            <div id="menu" data-role="navbar">
                <ul class="menu-items">
                    <li class="menu-item first"><a href='info.aspx'>
                        <img src="icon/nav1.png" /><br />
                        <span style="color: #000; font-weight: bold;">公告訊息</span></a> </li>
                    <li class="menu-item"><a href="#">
                        <img src="icon/nav2.png" /><br />
                        <span style="color: #000; font-weight: bold;">公車踹共</span></a> </li>
                    <li class="menu-item"><a href="#chatpage">
                        <img src="icon/nav3.png" /><br />
                        <span style="color: #000; font-weight: bold;">動態資訊</span></a> </li>
                    <li class="menu-item last"><a href="javascript:void(0);">
                        <img src="icon/nav4.png" /><br />
                        <span style="color: #000; font-weight: bold;">到站時間</span></a>
                        <select name="setstop" id="setstop" onchange="SetEndStop(this)" data-role="none">
                            <option value="">不設定</option>
                        </select>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    
</body>
</html>
<script src="js/app.js" type="text/javascript"></script>
